<div class="bg-transparent text-gray-200 flex flex-col items-center">
     <div class="flex flex-col items-center justify-center gap-8">
         <h1 class="text-3xl font-bold">搜索你想要的组件</h1>
         <div class="relative w-full max-w-3xl">
             <input type="text" placeholder="请输入关键词" class="w-full pl-4 pr-10 py-2 border border-gray-300 rounded-xl shadow-sm focus:outline-none focus:ring-2 focus:ring-gray-200"/>
             <div class="absolute inset-y-0 right-0 flex items-center pr-3 pointer-events-none">
                 <svg class="h-5 w-5 text-gray-400" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                     <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                           d="M21 21l-4.35-4.35m1.15-5.4a7 7 0 11-14 0 7 7 0 0114 0z" />
                 </svg>
             </div>
         </div>
         <div>常见搜索关键词：导航，手风琴，轮播，表格</div>
     </div>
</div>
